JavaScript ที่มีความชัดเจน: การเริ่มต้นเขียนโปรแกรมในยุคใหม่: การออกแบบเพื่อความยืดหยุ่น: หน้าตาตาราง

รากฐานของระบบยืดหยุ่นอยู่ที่การกำหนดสัญญาหรืออินเทอร์เฟซภายในที่แน่นอน สัญญา หรืออินเทอร์เฟซที่วัตถุต้องปฏิบัติตาม ในบริบทนี้ เราจะกำหนด อินเทอร์เฟซตาราง ที่วัตถุเซลล์ทุกตัวรับรองว่ามีเมธอดเฉพาะสามแบบที่จำเป็น: minWidth(), minHeight()และ draw(width, height).

1. สัญญาอินเทอร์เฟซ

โดยการมาตรฐานเมธอดเหล่านี้ ตรรกะการจัดวางสามารถคำนวณขนาดแถวและคอลัมน์ทั่วไปได้ โดยไม่ต้องรู้ประเภทข้อมูลภายในของเซลล์แต่ละตัว นี่เป็นตัวอย่างคลาสสิกของ พอลิโมฟิซึมที่อิงจากอินเทอร์เฟซ.

2. การใช้งานคลาส TextCell

เมธอด TextCell คอนสตรัคเตอร์จะเตรียมข้อมูลดิบโดยการแยกสตริงออกเป็นอาร์เรย์ตามบรรทัด ซึ่งจะเปลี่ยนความซับซ้อนจากขั้นตอนการวาดภาพมาเป็นขั้นตอนการสร้างวัตถุ

this.text = text.split("\n");

3. การวาดที่แน่นอน

เมธอด draw(width, height) เมธอดนี้รับประกันว่าผลลัพธ์ของทุกเซลล์จะถูกเติมเต็มอย่างสมบูรณ์โดยใช้ฟังก์ชันช่วยเสริม repeat() ช่วยให้การจัดเรียงแนวตั้งและแนวนอนคงที่ ไม่ว่าความยาวของเนื้อหาจะเป็นเท่าใด

$$\text{การเติม} = \text{กว้าง} - \text{ความยาวบรรทัด}$$

TERMINALbash — 80x24

> Ready. Click "Run" to execute.

QUESTION 1

What is the primary benefit of the Table Interface contract in this design?

It forces all data to be strings.

It allows the layout engine to remain agnostic of the data it displays.

It speeds up JavaScript memory allocation.

It automatically creates HTML tables.

QUESTION 2

In TextCell.prototype.minWidth, why is reduce used?

To sum the length of all lines.

To find the longest line length in the cell.

To remove empty lines.

To convert the array back into a string.

✅ Correct!

It uses Math.max within reduce to distill the array of lines down to a single maximum width value.

QUESTION 3

What does TextCell.prototype.draw(width, height) return?

A single long string with newline characters.

A canvas object for rendering.

An array of strings, each exactly 'width' characters wide.

A boolean indicating if the draw was successful.

QUESTION 4

What is the purpose of the repeat helper function?

To handle cell borders.

To add padding spaces to ensure straight columns.

To duplicate rows for larger tables.

To loop through the cell array.

❌ Incorrect

repeat is a utility for string padding, which is critical for visual alignment in text tables.

QUESTION 5

How does TextCell handle a multi-line string input?

It rejects it as invalid data.

It stores it as an array using split('\n').

It replaces newlines with spaces.

It only keeps the first line.

❌ Incorrect

The constructor breaks the input down so minHeight and minWidth can perform calculations on the lines.